{{ template "header" . }}

<header id=page-header><h1>{{ .Title }}</h1></header>

<main id=two-pane>
    {{ template "nav" . }}

{{ if eq .Title "Statistics" }}
    <div id=overview>
        <a href=stats/cheevos>
            <h2>Achievements</h2>
            <span>
                {{ .Data.Cheevos }}
                <small>({{ comma .Data.CheevosEarned }} earned)</small>
            </span>
        </a>

        <a href=stats/countries><h2>Countries</h2>{{ .Data.Countries }}</a>
        <a href=stats/golfers><h2>Golfers</h2>{{ comma .Data.Golfers }}</a>

        <a href=stats/holes>
            <h2>Holes</h2>
            <span>
                {{ .Data.Holes }}
                {{ with .Data.HolesExp }}
                    <small>({{ . }} experimental)</small>
                {{ end }}
            </span>
        </a>

        <a href=stats/langs>
            <h2>Languages</h2>
            <span>
                {{ .Data.Langs }}
                {{ with .Data.LangsExp }}
                    <small>({{ . }} experimental)</small>
                {{ end }}
            </span>
        </a>

        <div>
            <h2>Solutions</h2>
            <span>
                {{ comma .Data.Solutions }}
                <small>({{ bytes .Data.Bytes }})</small>
            </span>
        </div>
    </div>
{{ else if eq .Title "Statistics: Achievements" }}
    <table class="nowrap-second sticky">
        <thead>
            <tr>
                <th>#
                <th>Achievement
                <th class=right>Golfers
                <th class=right>Percent
        <tbody>
        {{ range .Data }}
            <tr>
                <td>{{ .Rank }}<sup>{{ ord .Rank }}</sup>
                <td>
                    <a href="/rankings/cheevos/{{ .Cheevo.ID }}"
                        title="{{ .Cheevo.Name }} - {{ .Cheevo.Description }}">
                        {{ .Cheevo.Emoji }}
                        <span>{{ .Cheevo.Name }}</span>
                    </a>
                <td class=right>{{ comma .Golfers }}
                <td class=right>{{ .Percent }}%
        {{ end }}
    </table>
{{ else if eq .Title "Statistics: Countries" }}
    <table class="nowrap-second sticky">
        <thead>
            <tr>
                <th>#
                <th>Country
                <th class=right>Golfers
                <th class=right>Percent
        <tbody>
        {{ range .Data }}
            <tr>
                <td>{{ .Rank }}<sup>{{ ord .Rank }}</sup>
                <td>
                {{ with .Country }}
                    <span class=flag title="{{ .ID }}">{{ .Flag }}</span>
                    {{- .Name }}
                {{ else }}
                    Rather not say
                {{ end }}
                <td class=right>{{ comma .Golfers }}
                <td class=right>{{ .Percent }}%
        {{ end }}
    </table>
{{ else if eq .Title "Statistics: Golfers" }}
    <script id=chart-data type="application/json">[
        {{- range $i, $d := .Data -}}
            {{- if ne $i 0 }},{{ end -}}
            { "x": {{ .Date.UnixMilli }}, "y": {{ .Sum }} }
        {{- end -}}
    ]</script>

    <div id=chart-container><canvas></canvas></div>

    <div>
        <table>
            <thead>
                <tr>
                    <th>Year
                    <th class=right>Golfers
                    <th class=right>Per Day
                    <th class=right>Total
            <tbody>
            {{ range slice .Data 1 }}
                <tr>
                    <td>{{ .Date.Year }}
                    <td class=right>{{ comma .Count }}
                    <td class=right>{{ .PerDay }}
                    <td class=right>{{ comma .Sum }}
            {{ end }}
        </table>
    </div>
{{ else if eq .Title "Statistics: Unsolved Holes" }}
    <div id=unsolved>
    {{ $hole := "" }}
    {{ range .Data }}
        {{ if ne $hole .Hole.Name }}
            <h2>{{ .Hole.Name }}</h2>
            {{ $hole = .Hole.Name }}
        {{ end }}

        <a class=btn href="/{{ .Hole.ID }}#{{ .Lang.ID }}">
            {{ svg .Lang.ID }} {{ .Lang.Name }}
        </a>
    {{ end }}
    </div>
{{ else }}
    <table class="nowrap-second sticky">
        <thead>
            <tr>
                <th>#
                <th>{{ .Data.Fact }}
                <th class=right>Solutions
                <th class=right>Golfers
                <th class="right wide">Per Golfer
                <th class="right wide">Avg Time
        <tbody>
        {{ range .Data.Rows }}
            <tr>
                <td>{{ .Rank }}<sup>{{ ord .Rank }}</sup>
                <td>
                {{ with .Hole }}
                    <a href="/{{ .ID }}">
                        <span>{{ .Name }}</span>
                        {{ if .Experiment }}{{ svg "flask" }}{{ end }}
                    </a>
                {{ end }}
                {{ with .Lang }}
                    <a href="/recent/{{ .ID }}">
                        {{ svg .ID }}
                        <span>{{ .Name }}</span>
                        {{ if .Experiment }}{{ svg "flask" }}{{ end }}
                    </a>
                {{ end }}
                <td class=right>{{ comma .Count }}
                <td class=right>{{ comma .Golfers }}
                <td class="right wide">{{ .PerGolfer }}
                <td class="right wide">{{ duration .AvgTime }}
        {{ end }}
    </table>
{{ end }}
</main>

{{ template "footer" }}
